/**
 * 信息概览页面JS
 */
var channelTable;
var edit_btn_template;
var url_table_language;

$(function () {

    //激活页面
    activeMenu("index-manager")

    //初始化分页表格
    channelTable = initChannelTable();

    //资源图标信息
    var dataCPU = [], dataMEM = [], dataDISK = [] , dataPORT = [] ,totalPoints = 100;

    //获取CPU画图信息
    function getCPUData() {
        if (dataCPU.length > 0) {
            dataCPU = dataCPU.slice(1);
        }
        // Do a random walk
        while (dataCPU.length < totalPoints) {
            var prev = dataCPU.length > 0 ? dataCPU[dataCPU.length - 1] : 50,
                y = prev + Math.random() * 10 - 5;

            if (y < 0) {
                y = 0;
            } else if (y > 100) {
                y = 100;
            }
            dataCPU.push(y);
        }
        // Zip the generated y values with the x values
        var res = [];
        for (var i = 0; i < dataCPU.length; ++i) {
            res.push([i, dataCPU[i]]);
        }
        return res;
    }

    //获取内存画图信息
    function getMEMData() {
        if (dataMEM.length > 0) {
            dataMEM = dataMEM.slice(1);
        }
        // Do a random walk
        while (dataMEM.length < totalPoints) {
            var prev = dataMEM.length > 0 ? dataMEM[dataMEM.length - 1] : 50,
                y = prev + Math.random() * 10 - 5;

            if (y < 0) {
                y = 0;
            } else if (y > 100) {
                y = 100;
            }
            dataMEM.push(y);
        }
        // Zip the generated y values with the x values
        var res = [];
        for (var i = 0; i < dataMEM.length; ++i) {
            res.push([i, dataMEM[i]]);
        }
        return res;
    }

    //获取硬盘画图信息
    function getDISKData() {
        if (dataDISK.length > 0) {
            dataDISK = dataDISK.slice(1);
        }
        // Do a random walk
        while (dataDISK.length < totalPoints) {
            var prev = dataDISK.length > 0 ? dataDISK[dataDISK.length - 1] : 50,
                y = prev + Math.random() * 10 - 5;

            if (y < 0) {
                y = 0;
            } else if (y > 100) {
                y = 100;
            }
            dataDISK.push(y);
        }
        // Zip the generated y values with the x values
        var res = [];
        for (var i = 0; i < dataDISK.length; ++i) {
            res.push([i, dataDISK[i]]);
        }
        return res;
    }

    /**
     * 获取端口画图信息
     */
    function getPORTData() {
        if (dataPORT.length > 0) {
            dataPORT = dataPORT.slice(1);
        }
        // Do a random walk
        while (dataPORT.length < totalPoints) {
            var prev = dataPORT.length > 0 ? dataPORT[dataPORT.length - 1] : 50,
                y = prev + Math.random() * 10 - 5;

            if (y < 0) {
                y = 0;
            } else if (y > 100) {
                y = 100;
            }
            dataPORT.push(y);
        }
        // Zip the generated y values with the x values
        var res = [];
        for (var i = 0; i < dataPORT.length; ++i) {
            res.push([i, dataPORT[i]]);
        }
        return res;
    }

    //初始化图表
    var interactive_plot = $.plot("#interactive",
        [getCPUData(),getMEMData(),getDISKData(),getPORTData()],
        {
            grid: {
                borderColor: "#f3f3f3",
                borderWidth: 1,
                tickColor: "#f3f3f3"
            },
            series: {
                shadowSize: 0// Drawing is faster without shadows
            },
            lines: {
                fill: false, //Converts the line chart to area chart
            },
            yaxis: {
                min: 0,
                max: 100,
                show: true
            },
            xaxis: {
                show: true
            }
        }
    );

    //设置图表刷新
    var updateInterval = 1000; //Fetch data ever x milliseconds
    var realtime = "on"; //If == to on then fetch data every x seconds. else stop fetching
    function update() {
        interactive_plot.setData([getCPUData(),getMEMData(),getDISKData(),getPORTData()]);
        // Since the axes don't change, we don't need to call plot.setupGrid()
        interactive_plot.draw();
        if (realtime === "on") {
            setTimeout(update, updateInterval);
        }
    }
    //INITIALIZE REALTIME DATA FETCHING
    if (realtime === "on") {
        update();
    }

});


/**
 * 初始化信息总览分页表格
 */
function initChannelTable() {
    return $('#packageList').dataTable(
        {
            language: {
                'url': url_table_language
            },
            processing: true, // 进度
            serverSide: true, // 服务器模式
            ordering: false, // 排序
            searching: false, // 搜索
            lengthChange: false, // 切换每页显示条数
            autoWidth: false, // 不自适应宽度
            deferRender: true, // 延迟加载
            stateSave: true, // 保存浏览状态 刷新后还在该页
            paging: false,
            //lengthMenu: [10, 25, 50, 100],
            //pagingType: 'full_numbers',
            // "info": false, // 左下角条数
            columns: [
                {"data": "ip"},
                {"data": "desc"},
                {"data": "status"},
                {"data": "operation"}
            ],
            columnDefs: [{
                "aTargets": [6],
                "mRender": function (data, type, row) {
                    var editBtn = genBtn(edit_btn_template, {url:"/api/add"})
                    return editBtn;
                }
            }],
            ajax: {
                'url':"/api/add",
                'data': function (d) {
                    d.columns = {};
                    return d;
                }
            }
        }
    ).DataTable();
}